<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html lang="en-US" xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
    <head>
    	<title>Dove Siamo - Contatti</title>

    	<meta http-equiv="Content-type" content="text/html"/>

		<meta name="author" content="Morris Antonello" />
    	<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
	    
		<!--link rel="shortcut icon" href="css/images/favicon.ico" /-->
	    <link rel="stylesheet" href="css/style_global.css" type="text/css" media="all" />
		<link rel="stylesheet" href="css/style_mappa_sedi.css" type="text/css" media="all" />
		
		<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false"></script>
        <script type="text/javascript" src="jQuery/jquery-1.9.1.min.js"></script>
	
    </head>
    
	<body>
        <div id="wrapper">
			<h1 id="logo"><a href="index.jsp" title="Homepage Hesperia" ></a></h1>
	        
			<!-- LOGIN MENU -->
			<jsp:include page="login_menu.jsp"/>
			<!-- End LOGIN MENU -->
			<!-- MENU -->
			<jsp:include page="nav_menu.jsp"/>
	        <!-- End MENU -->
	       
			<div class="shell">
			
	            <!-- Main -->
	        
				<div id="main">
	            
					<!-- Box-Holder-->
	                <div class="box-holder">
		                <div class="box-top"></div>
		                <div class="box">
		                    
							<!-- inizio selezione sede -->
								<div class="sceltaSede">
									<form action="" name="sceltaSedeForm">
										<label for="sceltaSedeSelect" class="hidden">Scegli una sede:</label>
										<select id="sceltaSedeSelect" class="goSelect">
											<option value="-1" selected="selected">Tutte le sedi</option>
											<jsp:include page="../getSediSceltaMultipla"/>
											<!-- <option value="10" onclick="showInfo();">Sede 10</option> -->
										</select>
									</form>
								</div>
							<!-- fine selezione sede -->
							
							<div class="mappa-sede-holder">
								<div id="map"></div>
	    	                </div>
							
							<script type="text/javascript">
								$(document).ready(function(){
									$(".mappa-sede-holder").fadeTo(3000,1,"swing");
								});
							</script>
							
							<div id="infoSedeDinamiche">
								<div class="info-sede"><div class="noselezione">Nessuna sede selezionata!</div>!</div>
							</div>
							
				    	</div>
						
		                <div class="box-bottom"></div>
	                    
						<!-- End Box-Holder -->
	                
					</div>
	                
					<!-- End Main -->
	            
				</div>
			</div>
			<!-- Footer -->
			<jsp:include page="footer.html"/>
			<!-- end Footer -->	
		</div>
		
		
		<script type="text/javascript">
			
			function showInfo(obj){
				$(".info-sede").css("display", "none");
			}
			
			$(document).ready(function(){
				
				// INIZIO SCRIPT MAPPA CON SEGNAPOSTI DINAMICI

				document.getElementById("sceltaSedeSelect").value = '-1';
				var obj = {};
				obj.propertyName = "getDescrittoriSedi";
				obj.method = function() {
					<jsp:include page="../get-dettagli-sedi" />
				};
				var descrittoriSedi = obj.method(); // ottiene descrittoriSedi

				google.maps.visualRefresh = true;
				
				var neighborhoods = new Array(descrittoriSedi.length); // segnapunti, sedi
				var bounds = new google.maps.LatLngBounds();
				
				for (var i = 0; i < neighborhoods.length; i++) {
					neighborhoods[i] = new google.maps.LatLng(descrittoriSedi[i][3], descrittoriSedi[i][4]);
					bounds.extend(neighborhoods[i]);
				}
				
				// centro della mappa, del punto di vista
				var centro = bounds.getCenter();
				
				var markers = [];
				var iterator = 0;

				var map;
				
				var contentString = new Array(descrittoriSedi.length);
				for (var i = 0; i < contentString.length; i++) {
					contentString[i] = 	'<div id="content">'+
											'<div id="siteNotice"></div>' +
											'<h3 id="firstHeading" class="firstHeading">' + descrittoriSedi[i][1] + '</h1>' +
											'<div id="bodyContent">' +
												'<p>' + descrittoriSedi[i][2] + '</p>' +
												'<p>' + descrittoriSedi[i][9] + '</p>' +
												'<p>' + descrittoriSedi[i][8] + '</p>' +
											'</div>'+
										'</div>';
				}
				
				var infowindow = new Array(descrittoriSedi.length);
				for (var i = 0; i < infowindow.length; i++) {
					infowindow[i] = new google.maps.InfoWindow({ // serve un array
					content: contentString[i],
					maxWidth: 200
					});
				}
				
				function initialize(){
					//alert("ininitialize");
					var myOptions = {
					  zoom: 08,
					  center: centro,
					  mapTypeId: google.maps.MapTypeId.ROADMAP,
					  mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.ROAD_MAP}
					};
					map = new google.maps.Map(document.getElementById("map"), myOptions);
				   
					setTimeout(drop(),5000);
				}
				
				function drop() {
					//alert("indrop");
					for (var i = 0; i < neighborhoods.length; i++) {
						setTimeout(function() {
							addMarker();
						}, i * 200);
					}
				}
				
				function addMarker() {
				  //alert("inmarker");
				  var marker = new google.maps.Marker({
						position: neighborhoods[iterator],
						map: map,
						draggable: false,
						animation: google.maps.Animation.DROP,
						title: descrittoriSedi[iterator][0] // magari solo l'indice
					});
				  google.maps.event.addListener(marker, 'click', function() {
						//alert(marker.getTitle()); // NO, da togliere iterator!
						infowindow[marker.getTitle()-1].open(map,marker); // NO, da togliere iterator!
				   });
				  markers.push(marker);
				  iterator++;
				}
				
				//alert("prestart");
				google.maps.event.addDomListener(window, 'load', initialize);
				
				// FINE SCRIPT MAPPA

				$("#sceltaSedeSelect").change(function() {			
					var value = $(this).children(":selected").attr("value");
					//alert(value);
					var content = "";
					var nomeCitta = "";
					
					if (value != "-1") {
						
						//alert(descrittoriSedi[value-1][5]);
						
						$.get('../getNomeCittaFromCodiceComune', {codiceComune:descrittoriSedi[value-1][5]})
						.done(function(res) {
							nomeCitta = '' + res;
						
							//alert('nomeCitta' + nomeCitta);
						
							content +=	'<div class="info-sede">' +
											'<div class="nome"> Hesperia ' + descrittoriSedi[value-1][1] + '</div>' +
											'<div class="paese">' + nomeCitta + '</div>' + // ci sono le coordinate, non la citta'
											'<div class="via">' + descrittoriSedi[value-1][2] + '</div>' +
											'<div class="info">' +
												'<div class="email"> <a href="mailto:' + descrittoriSedi[value-1][9] + '">' + descrittoriSedi[value-1][9] + '</a></div>' +
												'<div class="tel">' + descrittoriSedi[value-1][8] + '</div>' +
											'</div>' +
											'<div class="sale"> Numero sale: ' + descrittoriSedi[value-1][6] + '</div>' +
											'<div class="posti"> Posti a sedere: ' + descrittoriSedi[value-1][7] + '</div>' +
											'<div class="altre-info"> Il cinema apre 45 minuti prima dell&#39inizio del primo film della giornata </div>' +
										'</div>';
							//alert(content);
							
							$('#infoSedeDinamiche').html('' + content);
							
						});	
					
					} else {
						content +=  '<div class="info-sede"><div class="noselezione">Nessuna sede selezionata!</div></div>';
						$('#infoSedeDinamiche').html('' + content);
					}
					
				});
				
			});
			
		</script>
		
    </body>
</html>
